.work-aside {
    width: 300px;
    border-right: 1px solid var(--tiklab-gray-200);
    // background-color: var(--tiklab-gray-610);
    ul {
        padding: 0
    }

    .work-aside-option {
        border-radius: 4px;
        // position: relative;
        height: calc(100% - 120px);
        overflow: auto;
        // overflow-y: auto;
        width: 100%;
        background-color: #fff;
        .worklist-head-second {
            padding: 0 10px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 10px;
            margin-bottom: 10px;
        }
        .work-aside-top {
            padding: 10px;
            display: flex;
            justify-content: space-between;
            align-items: center;

            &-icon {
                width: 15px;
                height: 15px;
            }
        }

        .work-aside-sort {
            display: flex;
            justify-content: space-between;
            align-items: center;
            width: 100%;

            &-icon {
                width: 15px;
                height: 15px;
            }
        }

        .work-aside-fixed {
            border-radius: 4px;
        }
    }

    .work-aside-option::-webkit-scrollbar {
        width: 5px;
    }

    .work-aside-option::-webkit-scrollbar-thumb {
        border-radius: 5px;
        background: var(--tiklab-gray-500);
    }

    .work-aside-option::-webkit-scrollbar-track {
        border-radius: 0;
        background: var(--tiklab-gray-600);
    }

    // .work-aside-option {
    //     -ms-overflow-style: none;
    //     overflow: -moz-scrollbars-none;
    // }

    .work-aside-contant {
        width: 100%;
        overflow: auto;

        .work-aside-ul {
            list-style-type: none;
        }

        .child {
            padding-left: 20px;
        }


        .work-aside-item {
            display: flex;
            align-items: center;
            padding: 10px;
            margin: 0 10px;
            border-radius: 5px;
            .work-aside-item-icon {
                margin-right: 5px;
                height: 44px;
                padding-top: 5px;
            }
            .work-aside-item-name {
                flex: 1;
                overflow: hidden;
                padding-right: 10px;

                .work-aside-item-first {
                    display: inline-flex;
                    justify-content: space-between;
                    width: 100%;

                    .work-aside-item-status {
                        border-radius: 3px;
                        background: #eaedf1cf;
                        font-size: 12px;
                        padding: 2px 5px;
                        color: #fff;
                    }
                }

                .work-aside-item-second {
                    height: 22px;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    overflow: hidden;
                }
            }

            .work-aside-status {
                padding: 2px 3px;
                background: #e2e1e4;
                border-radius: 4px;
                font-size: 10px;
                width: fit-content;
                color: #2b333e;
                line-height: 16px;
            }

            .work-status-process {
                background: #b0d5dfa1;
                color: #132c33;
            }

            .work-status-done {
                background: #dfecd5e3;
                color: #5e5314;
            }
        }

        .work-aside-item:hover {
            background-color: var(--tiklab-gray-610);
            color: var(--tiklab-blue);
        }

        .work-aside-select {
            background-color: var(--tiklab-gray-610);
        }

        .work-aside-hidden {
            display: none;
        }
    }

    .work-aside-page {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 5px 10px;
        // background: var(--tiklab-gray-600);
        
        .work-aside-page-total {
            font-size: 12px;
            cursor: pointer;
            color: #666;
        }
        .work-aside-page-ref {
            font-size: 12px;
            cursor: pointer;
            color: #666;
        }
    }
    .work-aside-bottom {
        text-align: center;
        font-size: 12px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 600;
        gap: 10px;
        .page-button {
            height: 20px;
            width: 20px;
            border-radius: 5px;
            display: flex;
            align-items: center;
            align-items: center;
            justify-content: center;
            .page-disable {
                color: #ccc;
            }
        }
        .page-button:hover {
            background: #f7f7f7;
        }
    }
}